<template>
		<div class="app-container">
			<h4>用户信息</h4>
			<table  class="table  table-striped  table-condenseda  table-bordered"  width="100%">
					<tbody>
						<tr>
								<th  width="15%">手机号</th>
								<td  width="35%"><b>{{  userInfo.phone  }}</b></td>
								<th  width="15%">用户姓名</th>
								<td  width="35%">{{  userInfo.name  }}</td>
							</tr>
						<tr>
								<th>状态</th>
								<td>{{  userInfo.status  ==  0  ?  '锁定'  :  '正常'  }}</td>
								<th>注册时间</th>
								<td>{{  userInfo.createTime  }}</td>
						</tr>
				 </tbody>
			</table>
				<h4>认证信息</h4>
				<table  class="table  table-striped  table-condenseda  table-bordered"  width="100%">
					<tbody>
						<tr>
							<th  width="15%">姓名</th>
							<td  width="35%"><b>{{  userInfo.name  }}</b></td>
							<th  width="15%">证件类型</th>
							<td  width="35%">{{  userInfo.certificatesType  }}</td>
						</tr>
						<tr>
							<th>证件号</th>
							<td>{{  userInfo.certificatesNo  }}</td>
							<th>证件图片</th>
							<td><img  :src="userInfo.certificatesUrl"  style="height: 200px;"></td>
						</tr>
				 </tbody>
			 </table>
			 <h4>就诊人信息</h4>
			 <el-table
					v-loading="listLoading"
					:data="patientList"
					stripe
					style="width:  100%">
					<el-table-column type="index" label="序号" width="50" />
					<el-table-column  prop="name"  label="姓名"/>
					<el-table-column  prop="param.certificatesTypeString"  label="证件类型"/>
					<el-table-column  prop="certificatesNo"  label="证件编号"/>
					<el-table-column  label="性别">
						<template  #default="scope">
														{{  scope.row.sex  ==  1  ?  '男'  :  '女'  }}
						</template>
					</el-table-column>
					<el-table-column  prop="birthdate"  label="出生年月"/>
					<el-table-column  prop="phone"  label="手机"/>
					<el-table-column  label="是否结婚">
						<template  #default="scope">
														{{  scope.row.isMarry  ==  1  ?  '时'  :  '否'  }}
						</template>
					</el-table-column>
					<el-table-column  prop="fullAddress"  label="地址"/>
					<el-table-column  prop="createTime"  label="注册时间"/>
				</el-table>
				<br>
				<el-row>
					<el-button    @click="back">返回</el-button>
				</el-row>
		</div>
</template>
<script lang='ts'>
import  {show}  from '/@/api/user'
import { defineComponent, onMounted, reactive, toRefs } from 'vue';
import { useRoute } from 'vue-router';
export  default defineComponent({
	name: 'showInfo',
	setup() {
		const route = useRoute();
		const state= reactive({
			id:  route.params.id,
			userInfo:  {},  //  会员信息
			patientList:  []  //  就诊人列表
		});

		//  根据id查询会员记录
		const  fetchDataById=()=>{
			show(state.id).then((response:any)  =>  {
				debugger
				state.userInfo  =  response.data.userInfo
				state.patientList  =  response.data.patientList
			})
		}
		const back=() => {
			window.history.back(-1)
		}
		onMounted(()=>{
			fetchDataById()
		})
		return{
			...toRefs(state),
			back,
			fetchDataById
		};
	}
})
</script>